import React, { Component } from 'react';
import { Row, Col } from 'antd';
import { connect } from 'dva';
import Condition from './components/condition';
import KpiNumber from './components/kpiNumber';
import KpiTable from './components/kpiTable';
import KpiPie from './components/kpiPie';
import Backlog from './components/backlog';
import Source from './components/source';
class Home extends Component {
  constructor() {
    super();
    this.state = {
      name: 'Caroline',
    };
  }
  componentDidMount() {
    this.props.dispatch({ type: 'home/init' });
  }

  getPrivate(role) {
    const privilegeList =
      JSON.parse(sessionStorage.getItem('privilegeList')) || [];
    const hasAuth = privilegeList.some(item => item.code == role);
    return hasAuth;
  }
  render() {
    const { name } = this.state;
    const invest = this.getPrivate('see_invest_count_analysis');
    const commission = this.getPrivate('examine_plan_project');
    return (
      <div>
        {invest ? (
          <div>
            <Condition />
            <Row
              style={{
                backgroundColor: 'white',
                marginTop: 10,
                display: 'flex',
                alignItems: 'center',
              }}
            >
              <Col span={12}>
                <KpiNumber type="kpiCount" />
              </Col>
              <Col span={12}>
                <KpiTable type="kpiCount" />
              </Col>
            </Row>
            <Row
              style={{
                backgroundColor: 'white',
                marginTop: 10,
                display: 'flex',
                alignItems: 'center',
              }}
            >
              <Col span={12}>
                <KpiNumber type="kpiMoney" />
              </Col>
              <Col span={12}>
                <KpiTable type="kpiMoney" />
              </Col>
            </Row>
            <Row style={{ marginTop: 10 }}>
              <Col
                style={{ width: 'calc(50% - 5px)', backgroundColor: 'white' }}
              >
                <KpiPie title="年度项目数量KPI-增量存量分析" type="count" />
              </Col>
              <Col
                style={{
                  width: 'calc(50% - 5px)',
                  marginLeft: '10px',
                  backgroundColor: 'white',
                }}
              >
                <KpiPie title="年度项目投资KPI-增量存量分析" type="money" />
              </Col>
            </Row>
          </div>
        ) : (
          ''
        )}

        {commission ? (
          <Row style={{ backgroundColor: 'white', marginTop: 10 }}>
            <Backlog />
          </Row>
        ) : (
          ''
        )}

        <Source />
      </div>
    );
  }
}
export default connect(state => state.home)(Home);
